<template>
	<view class="myInviteTeachers-page">
		<head-box></head-box>

		<view class="myInviteTeachers-page-main">
			<view class="myInviteTeachers-page-main-item" v-for="item,index in 1" :key="index">
				<view class="myInviteTeachers-page-main-item-header">
					<view class="_item-header-title"><text>春风应急救援培训活动</text><text class="pf"><img src="/static/img/fen.png" v-for="item1,index1 in 4" :key="index1" /></text></view>
				</view>

				<view class="myInviteTeachers-page-main-item-content">
					<view class="myInviteTeachers-page-main-item-content-inner">
						<view class="_content-inner-img"><img class="_img" src="/static/img/chunfeng.png" mode="aspectFit"></img></view>
						<view class="_content-inner-detail">
							<view class="_content-inner-detail-item">
								<view class="_content-inner-detail-item-badge">
									<text class="_content-inner-detail-item-badge-text">气到异物梗阻</text>
									<text class="_content-inner-detail-item-badge-text">心脏按压培训</text>
								</view>
								<view class="_content-inner-detail-item-info">
									<text>应急救护的基本知识；强化心肺复苏、创伤救护等核心技术以及常见急症、意外伤害、突发事件的处置要领；教授授课技巧、心理援助等内容。</text>
								</view>
							</view>
						</view>
					</view>
				</view>

				<view class="myInviteTeachers-page-main-item-bottom">
					<view class="myInviteTeachers-page-main-item-bottom-text"><text>培训时间：2021-03-31 14:31:31</text></view>
					<view class="myInviteTeachers-page-main-item-bottom-text"><text>已签到 | 已评价</text></view>
				</view>
			</view>
			<view class="myInviteTeachers-page-main-item" v-for="item,index in 4" :key="index">
				<view class="myInviteTeachers-page-main-item-header">
					<view class="_item-header-title"><text>青少年呵护线下培训活动</text></view>
				</view>

				<view class="myInviteTeachers-page-main-item-content">
					<view class="myInviteTeachers-page-main-item-content-inner">
						<view class="_content-inner-img"><img class="_img" src="/static/img/qingshaonian.png" mode="aspectFit"></img></view>
						<view class="_content-inner-detail">
							<view class="_content-inner-detail-item">
								<view class="_content-inner-detail-item-badge">
									<text class="_content-inner-detail-item-badge-text">青少年心理健康</text>
									<text class="_content-inner-detail-item-badge-text">青少年教育</text>
								</view>
								<view class="_content-inner-detail-item-info">
									<text>多数人面临重大考试总会引起一些心理压力,产生一定程度的考试焦虑,之是正常的,没有害处。但是过度考试焦虑...</text>
								</view>
							</view>
						</view>
					</view>
				</view>

				<view class="myInviteTeachers-page-main-item-bottom">
					<view class="myInviteTeachers-page-main-item-bottom-text"><text>培训时间：2021-03-31 14:31:31</text></view>
					<view class="myInviteTeachers-page-main-item-bottom-text"><text>已签到 | 待评价</text></view>
				</view>
			</view>
		</view>

		<tabs-box></tabs-box>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			};
		},
		onLoad() {

		},
    onShow(){
      // #ifdef H5
      console.log('分享')
      this.$wxSetShare()
      // #endif
    },
		methods:{
			toBack() {
				uni.navigateBack({
					delta:1
				})
			},
		}
	}
</script>

<style lang="scss">
	.myInviteTeachers-page{
		width: 100%;
		box-sizing: border-box;
		padding-bottom: 200rpx;
		background-color: #efeff4;
		line-height: 42rpx;
		.top-fixed{
			position: fixed;
			top: 0;
			z-index: 1;
		}
		.top{
			width: 100%;
			height:100rpx;
			padding:0 30rpx;
			// background-color: #007AFF;
			background-color: #f7f7f7;
			box-shadow: 0 1px 6rpx #ccc;
			display:flex;
			justify-content:space-between;
			align-items: center;
			box-sizing: border-box;
			.top-text{
				color:#000;
				font-size:34rpx;
			}
		}
		.top-box{
			width: 100%;
			height: 100%;
			position: relative;
			text-align: center;
			line-height: 100rpx;
			.back-img{
				width:44rpx;
				height:40rpx;
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				bottom: 0;
				margin:auto;
				margin-left: 0rpx;
			}
		}
		.myInviteTeachers-page-main{
			width: 100%;
			padding: 0 20rpx;
			box-sizing: border-box;
			.myInviteTeachers-page-main-item{
				width: 100%;
				border-radius: 4rpx;
				background-color: white;
				background-clip: padding-box;
				box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.3);
				margin-top: 30rpx;
				.myInviteTeachers-page-main-item-header{
					position: relative;
					display: -webkit-box;
					display: -webkit-flex;
					display: flex;
					min-height: 88rpx;
					padding: 20rpx 30rpx;
					box-sizing: border-box;
					-webkit-box-pack: justify;
					-webkit-justify-content: space-between;
					justify-content: space-between;
					-webkit-box-align: center;
					-webkit-align-items: center;
					align-items: center;
					font-size: 34rpx;
					border-radius: 4rpx 4rpx 0 0;
					border-bottom: 1px solid rgba(200,199,204,0.5);
					._item-header-title{
						.pf{
							position:absolute;
							right: 10rpx;
							img{
								width: 40rpx;
							}
						}
					}
				}
				.myInviteTeachers-page-main-item-content{
					font-size: 28rpx;
					position: relative;
					.myInviteTeachers-page-main-item-content-inner{
						position: relative;
						padding: 30rpx;
						box-sizing: border-box;
						display: flex;
						flex-wrap: nowrap;
						justify-content: flex-start;
						._content-inner-img{
							width: 160rpx;
							height: 230rpx;
							border-radius: 10rpx;
							._img{
								width: 100%;
								height: 100%;
								border-radius: 10rpx;
							}
						}
						._content-inner-detail{
							width: calc(100% - 160rpx);
							._content-inner-detail-item{
								._content-inner-detail-item-badge{
									margin-left: 20rpx;
									._content-inner-detail-item-badge-text{
										margin: 0 10rpx;
										font-size: 24rpx;
										padding: 10rpx 20rpx;
										background-color: #F0AD4E;
										color: #fff;
										border-radius: 40rpx;
										box-sizing: border-box;
									}
								}
								._content-inner-detail-item-info{
									text-indent: 2em;
									padding: 20rpx 0 0 20rpx;
									box-sizing: border-box;
								}
							}
						}
					}
				}
				.myInviteTeachers-page-main-item-bottom{
					position: relative;
					display: -webkit-box;
					display: -webkit-flex;
					display: flex;
					min-height: 88rpx;
					padding: 20rpx 30rpx;
					box-sizing: border-box;
					-webkit-box-pack: justify;
					-webkit-justify-content: space-between;
					justify-content: space-between;
					-webkit-box-align: center;
					-webkit-align-items: center;
					align-items: center;
					border-top: 1px solid rgba(200,199,204,0.5);
					.myInviteTeachers-page-main-item-bottom-text{
						color: #6d6d72;
						border-radius: 0 0 4rpx 4rpx;
						font-size: 28rpx;
					}
				}
			}
		}
	}
</style>
